import { useState, useEffect } from 'react'
import { resourcePath } from '../../../../../../../utils/resource';
import { Button, Table } from 'antd';
import useBusinessMap from '../../../../../../common/BusinessMap/useBusinessMap';
import { navByWkt } from '../../../../../../../utils/helper/mapHelper';
import JcyjApi from '../../../../../../../utils/apis/JcyjApi';
import BlockTitle from '../../../../../../framework/BlockTitle';
import BlockBody from '../../../../../../framework/BlockBody';
export default function Sksq(props) {
    const [datas, setDatas] = useState();

    const [params, setParams] = useState({
        //pageSize: 5,
        //pageNum: 1,
        jcdlx: 'RR'
    });
    const [total, setTotal] = useState();

    useEffect(() => {
        JcyjApi.jcdList(params).then(resp => {
            setDatas(resp.rows)
            //console.log("水库",resp.rows.map(e=>e.zdm),resp.rows.map(e=>e.zdid))

            setTotal(resp?.total);
        });
    }, [params])

    const map = useBusinessMap();

    return <div>
        <BlockTitle>
            水库水情（<span>{total}</span>）
        </BlockTitle>

        <BlockBody><Table
            style={{
                // height: 233
            }}
            // scroll={{ y: 154 }}
            columns={[{
                title: '站点名',
                dataIndex: 'zdm',
                ellipsis: true
            }, {
                width: 70,
                align: "center",
                render: (text, record) => {
                    return <Button type="link" size="small" onClick={e => {
                        if (record.geom) {
                            navByWkt(record.geom, map)
                        }
                        //console.log("水库",record)
                        props.onDetail?.(record);
                        props.setShowScroll(false);
                        props.setDetailItem(record);
                        setTimeout(() => {
                            props.setShowScroll(true);
                        }, 0)
                    }}>详情</Button>
                }
            }]} dataSource={datas}
            size="small"
            bordered
            onRow={record => {
                return {
                    onClick: e => {
                        if (record.shp) {
                            navByWkt(record.shp, map)
                        }
                    }
                }
            }}
            pagination={{
                current: params.pageNum,
                pageSize: params.pageSize,
                total,
                simple: true,
                onChange: (page) => {
                    setParams(params => {
                        return {
                            ...params,
                            pageNum: page
                        }
                    })
                }
            }}
        />
        </BlockBody>
    </div>;
}